// pages/hone/index/index.js
var config = require('../../../config');
var strings = require('../../../strings.js');
Page({

  /**
   * 页面的初始数据
   */
  data: {
    //顶部导航栏列表
    itemList: [],
    movableAreaWidth: 0, //滑块宽度
    windowWidth: 0, //屏幕宽度
    currentTab: 0, //预设当前项的值
    currentTabID: "", //当前默认导航ID
    scrollLeft: 0, //tab标题的滚动条位置
    headMovaLne: 30, //顶部导航栏小红条宽度
    navX: 0, //顶部列表下标
    tabItemWidth: 0, //tab选项单个宽度
    rectWidth: 0, //节点宽度,获取不同分辨率下顶部导航栏单个选项文字大小
    //banner 图片地址列表
    bannerImgUrls: [{
      id: 1,
      url: 'http://img02.tooopen.com/images/20150928/tooopen_sy_143912755726.jpg'
    }, {
      id: 2,
      url: 'http://img06.tooopen.com/images/20160818/tooopen_sy_175866434296.jpg'
    }, {
      id: 3,
      url: 'http://img06.tooopen.com/images/20160818/tooopen_sy_175833047715.jpg'
    }, ],
    indicatorDots: false,
    autoplay: true,
    interval: 3000,
    duration: 1000,
    circular: true,
    //搜索结果列表
    resultGoodsList: [],
    title: '', //商品大标题
    isSearchFlg: false, //是否点击搜索
    value: "", //搜索框，键盘输入的字符
    curStart: 0, //当前页
    isPage: true, //是否允许翻页
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function() {
    var that = this
    that.getBannerImg()
    that.getHomeData()
  },
  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function() {

  },
  /**
   * 获取不同屏幕节点大小，不同屏幕自适应
   */
  getRect: function() {
    var that = this
    wx.createSelectorQuery().select('#itemID').boundingClientRect(function(rect) {
      var rectWidth = rect.width / that.data.itemList[0].name.length //单个导航有多少个字就除以几，求出一个文字的宽度
      that.setData({
        rectWidth,
      })
      var headMovaLne = that.data.itemList[0].name.length * 29 //计算顶部导航栏小红条初始长度
      that.setData({
        headMovaLne,
        scrollLeft: 1
      })
    }).exec()
  },
  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function() {
    var that = this

  },

  /**
   * 顶部导航栏滑动事件
   */
  tabTap: function(e) {
    var movableAreaWidth = e.detail.scrollWidth //将scroll-view 组件宽度赋值给movable组件，使其自适应
    var tabItemWidth = e.detail.scrollWidth / this.data.itemList.length //计算单个导航标题宽度
    this.setData({
      tabItemWidth,
      movableAreaWidth
    })
  },
  // 点击标题切换当前页时改变样式和Tab列表位置
  swichNav: function(e) {
    var cur = e.currentTarget.dataset.index; //获取当前点击标题下标
    if (this.data.currentTab == cur) {
      return false;
    }
    this.setData({
      title: this.data.itemList[cur].name,
      value: "",
      curStart: 0,
      resultGoodsList: [],
      isSearchFlg: false,
      currentTabID: this.data.itemList[cur].id
    })
    this.getRedMove(cur)
    this.getSearchData(this.data.curStart)
  },
  //获取小红条滑动距离
  getRedMove: function(cur) {
    var cur = cur
    var headMovaLne = this.data.itemList[cur].name.length * 29 //计算顶部导航栏小红条当前长度
    console.log(headMovaLne)
    this.setData({
      headMovaLne
    })
    var x = 0
    for (var i = 0; i < cur; i++) {
      x += this.data.itemList[i].name.length * this.data.rectWidth + 16 //magin为多少px，就减去多少个单位
    }
    this.setData({
      currentTab: cur,
      navX: x,
    })
    this.checkCor();
  },
  //判断当前滚动超过一屏时，设置tab标题滚动条。
  checkCor: function() {
    var currentTab = this.data.currentTab //获取当前点击标题下标，如果下标大于2，scroll-view组件才发生位移
    if (currentTab > 2) {
      var scrollLeft = (currentTab - 1) * this.data.tabItemWidth
      console.log(scrollLeft)
      this.setData({
        scrollLeft,
      })
      console.log(scrollLeft)
    } else {
      this.setData({
        scrollLeft: 1,
      })
    }
  },
  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function() {
    console.log("=====")
    var that = this
    if (!that.data.isPage) {
      return
    }
    console.log(that.data.curStart)
    that.setData({
      curStart: that.data.curStart + 1
    })
    that.getSearchData(that.data.curStart)
  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage: function() {

  },
  /**
   * 获取键盘输入
   */
  bindKeyInput: function(e) {
    console.log(e.detail.value)
    var value = e.detail.value
    this.setData({
      value
    })
  },
  /*
   * 点击搜索，返回搜索结果，如果输入为null,则提示用户输入
   */
  searchTap: function() {
    var that = this
    if (that.data.value.length == 0) {
      wx.showToast({
        title: strings.isValueNull,
        icon: "none"
      })
      return
    }
    that.setData({
      isPage: true,
      curStart: 0,
      resultGoodsList: [],
      isSearchFlg: true,
      currentTabID: ""
    })
    that.getSearchData(that.data.curStart)
  },
  /**
   * 获取搜索内容
   */
  getSearchData: function(curPage) {
    var that = this
    var curPage = curPage
    wx.request({
      url: config.getSearchData,
      method: 'GET',
      // header:{},
      data: {
        "start": curPage,
        "entity.name": that.data.value,
        "useDatatables": true,
        "entity.goodsType.id": that.data.currentTabID
      },
      success: function(res) {
        if (res.data.length < 5) {
          that.setData({
            isPage: false
          })
        }
        var resData = that.data.resultGoodsList
        res.data.forEach(function(el) {
          resData.push(el)
        })
        that.setData({
          resultGoodsList: resData
        })
      }
    })
  },
  /**
   * 获取首页banner图片
   */
  getBannerImg: function() {
    var that = this
    wx.request({
      url: config.getHomeBanner,
      method: "GET",
      success: function(res) {
        // that.setData({
        //   bannerImgUrls: res.data
        // })
      }
    })
  },
  /**
   * 获取顶部导航栏列表数据和今日主推数据
   */
  getHomeData: function() {
    var that = this
    wx.request({
      url: config.getHomeFirstData,
      method: 'GET',
      success: function(res) {
        console.log(res)
        that.setData({
          itemList: res.data.goodsType,
          resultGoodsList: res.data.ztGoods,
          title: res.data.goodsType[0].name
        })
        that.getRect()
      }
    })
  },
  //跳转到商品详情页
  goDetailsTap: function(e) {
    console.log(e)
    var id = e.currentTarget.dataset.id
    if (!id) {
      return
    }
    wx.navigateTo({
      url: '../details/index?id=' + id,
    })
  },
  //点击banner图片跳转至详情页
  bannerTap: function(e) {
    var id = e.currentTarget.dataset.id || null
    if (!id) {
      return
    }
    wx.navigateTo({
      url: '../details/index?id=' + id,
    })
  },
  /**
   * 点击左下角红色购物车，进入优惠商城购物车
   */
  goShopcartTap: function() {
    wx.navigateTo({
      url: '../shopcar/index/index',
    })
  },
  /**
   * 点击特权商城，跳转至特权商城页面
   */
  goPowerTap: function() {
    wx.switchTab({
      url: '/pages/store/index/index'
    })
  },
  /**
   * 点击优惠商城，刷新页面
   */
  // goHomeTap: function() {
  //   wx.switchTab({
  //     url: '/pages/home/index/index'
  //   })
  // }

})